<template>
  <el-dialog
    title="Set Permission"
    :visible.sync="currentVisible"
      destroy-on-close
      append-to-body
    width="500px"
  >
    <el-form>
      <el-form-item label="Role" required> </el-form-item>
    </el-form>

    <template slot="footer" class="dialog-footer">
      <el-button size="small">Cancel</el-button>
      <el-button size="small" type="primary">Ok</el-button>
    </template>
  </el-dialog>
</template>

<script>
import {
  fetchRole,
  fetchAssignRole
} from '@/api/new'

export default {
  name: 'UserSetRoleModal',
  props: {
    visible: Boolean
  },
  data () {
    return {
      roleOptions: []
    }
  },
  computed: {
    currentVisible: {
      get () {
        return this.visible
      },
      set (val) {
        this.$emit('update:visible', val)
      }
    }
  },
  methods: {
    init () {

    },
    async getRoles () {
      try {
        const params = {
          tenantCode: this.$store.state.user.tenantCode
        }
        const { data: response } = await fetchRole(params)
        if (response.code !== 0) {
          throw response.msg
        }
        return response.data || []
      } catch (error) {
        console.log(error)
        return []
      }
    },
    async getAssingRoles () {
      try {
        const roleIds = (this.$store.state.user.roleList || []).map(
          ({ id }) => id
        )
        const params = {
          roleId: roleIds
        }
        const { data: response } = await fetchAssignRole(params)
        if (response.code !== 0) {
          throw response.msg
        }
        return response.data || []
      } catch (error) {
        console.log(error)
        return []
      }
    }
  }
}
</script>
